<template>
	<view class="task">
		<view class="navigationBar">
			<tui-icon name="arrowleft" color="#ffffff" :size="50" class="navIcon" @click="tolastPage"></tui-icon>
			<view class="navText">任务详情</view>
		</view>
		<view class="conter">
			<view class="title">
				<view class="titleLeft">事件名称:</view>
				<view class="titleRight">
					<span style="background: #fe7a21;">待完成</span>
					
<!-- 					<span style="background: #d9001b;" v-if="item.state == '1'">待接收</span>
					<span style="background: #fe7a21;" v-else-if="item.state == '2'">待完成</span>
					<span style="background: #137a29;" v-else>已完成</span>
 -->				</view>
			</view>
			<view class="titlecon">事件名称事件名称事件名称</view>
			<view class="conterList">事发地址：XX村</view>
			<view class="conterList">事发时间：XX村</view>
			<view class="conterList">事件描述：XX村</view>
			<view class="conterList">涉及人数：XX村</view>
			<view class="conterList">事发级别：XX村</view>
		</view>
		<view class="line"></view>
		<view class="conter">
			<view class="conterList">办结人员：XX村</view>
			<view class="conterList">办结事件：XX村</view>
			<view class="conterList">情况反馈：XX村</view>
		</view>
	</view>
</template>

<script>

	export default {
		components: {
		},
		data() {
			return {
			};
		},
		computed: {},
		onLoad() {},
		onUnload() {},
		onShow() {
			
		},
		mounted() {
			  uni.$on('eventName', (params) => {
				console.log(params.uid)
			  });
		},
		methods: {
			tolastPage(){
				wx.navigateBack({
				  delta: 1 
				})
			},

		}
	}
</script>

<style lang="scss">
	.task{height: 100vh;}
	.navigationBar{position: relative; display: flex; justify-content: center; align-items: center; width: 100%; height: 180rpx; background: url('../../static/imgs/headbg.png') no-repeat; background-size: 100% 100%;
		.navIcon{position: absolute; left: 0;}
		.navText{font-size: 45rpx;}
	}
	.conter{padding:30rpx 30rpx 50rpx 30rpx;
		.title{display: flex; align-items: center; justify-content: space-between;
			.titleLeft{font-size: 43rpx; font-weight: bold; color:#333333;}
			.titleRight{text-align: right;
				span{padding: 5rpx 15rpx; color: #ffffff; border-radius: 10rpx;}
			}
		}
		.titlecon{font-size: 43rpx; font-weight: bold; color:#333333; margin-bottom: 30rpx;}
		.conterList{margin: 30rpx 0; font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif; font-weight: 400;  font-style: normal; color: #959CA6; font-size: 30rpx;}
	}
	.line{height: 1rpx; background: #929292;}

</style>